<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="">
    我是表单，从此开始通过ajax技术提交请求<br>
    <input type="button" value="发送ajax请求"  onclick="sendAjax()">
</form>
<script>
    function sendAjax(){
        console.log("sendAjax...")
        // servlet路径：/userdemo/ajaxServlet
        // 我们要异步请求Servlet
        //1. 创建核心对象
        var xhttp;
        if (window.XMLHttpRequest) {
            xhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        //2. 发送请求  GET POST
        xhttp.open("GET", "http://localhost:8080/userdemo/ajaxServlet");
        xhttp.send();

        //3. 获取响应，因为是异步的，所以通过如下代码拿到Servlet返回的数据
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                alert(this.responseText);
            }
        };

    }
</script>
</body>
</html>